<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page import="com.model.domain.persona.Hogar"%>
<%@page import="com.model.domain.ubicacion.CoordenadaGeografica"%>
<%@page import="com.model.domain.ubicacion.ViviendaMarco"%>
<%@page import="com.model.domain.ubicacion.Conglomerado"%>
<%@page import="com.model.domain.ubicacion.Vivienda"%>
<%@page import="com.model.domain.ubicacion.Odei"%>
<%@page import="java.util.List"%>
<%@page import="com.model.domain.ubicacion.Departamento"%>
<!-- #include file="control.asp" -->
<!-- #include file="config_cache.asp" -->
<!-- #include file="conexion.asp" -->
<!-- #include file="acceso.asp" -->

<%
String titulo = "GEO-REFERENCIACION DEL MARCO DE VIVIENDAS";
        
/*
dim excel
excel = trim(request.QueryString("excel"))
if excel = "S" then
	Response.AddHeader "Content-Disposition", "attachment; filename=ExportaReporte_Tablet_01.xls"
	Response.ContentType = "application/save" 
end if
dim clase_cab, clase_cab2, clase_subtit, clase_tablas, clase_pie, clase_pucp
if excel <> "S" then 
	clase_cab = "cab_tablas" 
	clase_cab2 = "cab_tablas2" 
	clase_subtit = "subtitulo2"
	clase_tablas = "tablas"
	clase_pie = "pie_tablas"
	clase_pucp = "pucpCeldaTabDesactivo"
else 
	clase_cab = "cab_tablas_tmp"
	clase_cab2 = "cab_tablas2_tmp"
	clase_subtit = "subtitulo2_tmp"
	clase_tablas = "tablas_tmp"
	clase_pie = "pie_tablas_tmp"
	clase_pucp = "pucpCeldaTabDesactivo_tmp"
end if
*/
    String excel = (String) request.getAttribute("excel");
    if(excel==null) excel =""; 
    
    String clase_subtit, clase_cab, clase_tablas;    
    
    if(!excel.equals("S")) {
        clase_subtit = "subtitulo2";
        clase_cab = "cab_tablas";
        clase_tablas = "tablas";
    }
    else {
        clase_subtit = "subtitulo2_tmp";
        clase_cab = "cab_tablas_tmp";
	clase_tablas = "tablas_tmp";
    }     
    
%>
<!DOCTYPE html>
<html>
<head>
    <title><%=titulo %></title>
    <meta charset="utf-8">
    
<script language="javascript">

function inicio(){
    verMensajeCarga(false); 
    //alert("cargado");
}

function actualizar_pagina(){
    verMensajeCarga(true);
    //obj = eval(document.getElementById("hdnaccion"));
    //if(obj) obj.value = "";
    document.getElementById("form1").action = "dispatcher?controller=reporte_transferencia&action=buscarGeoreferenciacionViviendas";
    document.getElementById("form1").submit();
}

function centrar(){
	// *** Usar en el caso se quiera centrar la tabla ***
	vleft = (screen.availWidth / 2) - (document.getElementById("cabecera").style.posWidth / 2);
	if(vleft > 0){
		document.getElementById("cabecera").style.left = vleft;
		
	}
	
}

	</script>	
        
        <link href="css/estilos.css" rel="stylesheet" type="text/css" >
</head>

<body onLoad="inicio();">
    <!--onload es sobreescrito al final de la pagina-->
    
<% if (!excel.equals("S")) { %>
    <%@include file="../../plantilla/mensaje_espera_reporte.html" %>      
<%}%>

<form name="form1" id="form1" method="post" action="reportegeorural_01.asp">
    <!-- El div cabecera debe tener 10px mas de ancho que el div detalle -->
    <div id="cabecera" style="position:absolute; left:5px; top:2px; width:1891px; height:45px; z-index:2">
    <!-- A la ultima Columna de la tabla de cabecera hay que agregarle 17px -->
	<br />
	
	<table border="0" id="tabla1" >
		<tr>
                    <% if(!excel.equals("S")) { %>
			<td height="25" valign="middle">
				
                            <b><font size="2"> ODEI&nbsp;</font></b>
                            <select name="odei" id="odei" style="z-index:0;vertical-align:middle; font-weight:bold; background-color:#CCFFCC">
                                    <option value="">--- TODOS ---</option>	
                                    <c:forEach items="${odeis}" var="e">
                                    <option value="${e.codigo}" 
                                            <c:if test="${filtro.odei.codigo==e.codigo}"> 
                                            selected="selected"
                                            </c:if>
                                        > ${e.codigo} ${e.nombre} </option>
                                    </c:forEach> 
                            </select>                           

                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    &nbsp;&nbsp;&nbsp;&nbsp;
			</td>
                        
                        <td height="25" valign="middle">                             
                            <b><font size="2"> Conglomerado:&nbsp;</font></b>
                            <select name="conglomerado" id="conglomerado" 
                                            style="vertical-align:middle; font-weight:bold; background-color:#CCFFCC">
                                <option value="" selected="selected">--- TODOS ---</option>
                                <c:forEach items="${conglomerados}" var="e">
                                <option value="${e.codigo}" 
                                        <c:if test="${filtro.codigo==e.codigo}"> 
                                        selected="selected"
                                        </c:if>
                                    >${e.codigo}</option>
                                </c:forEach>                                    
                            </select>
                        </td>
					
			<td width="482" align="center">
                            <input type="button" value="Buscar" onclick="javascript:actualizar_pagina()">
                                
			</td>
                    <%} else { %>
				
                            <td >ODEI </td>
                            <td width="482" colspan="15" align="center">				
                            </td>
                    <% } %>
				               
                    
                </tr>
                    
	</table>
                    
        <%
        List<ViviendaMarco> rsMonitor = (List<ViviendaMarco>) request.getAttribute("rsMonitor");
        int nroReg = rsMonitor.size();        
        Conglomerado filtro = (Conglomerado) request.getAttribute("filtro");
        %>

	<div id="wrapper">
		<h1> <%=titulo %> </h1>

                <% if(filtro!=null && nroReg>0) { %>
                <h3> Instrucci&oacute;n: Al dar click sobre una vivienda del mapa, se pueden ver los datos de la vivienda. </h3>
                <% } %>
		
                <div align="center" id="mapa" style="width:1000px;height:800px">
                    <% if(filtro!=null && nroReg==0) { %>
                        <p> <b> NO SE ENCONTRARON RESULTADOS </b> </p> 
                    <% } %>
                </div>
                
	</div>	
    </div>
</form>
                
	<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
        
    <% if(filtro!=null && nroReg>0) { %>
        
                                
	<script type="text/javascript">
		(function() {
			window.onload = function(){
				var andalucia = new google.maps.LatLng(-13.029351666666665,-74.13947499999999);
				var opciones = {
					zoom : 6,
					center: andalucia,
					mapTypeId: google.maps.MapTypeId.ROADMAP
				};
				var div = document.getElementById('mapa');
				var map = new google.maps.Map(div, opciones);
				var infowindow = new google.maps.InfoWindow({
					content: ''
				});
                                
				<% 
                                    int x;//dim x
                                    x = 1;                                    
                                %>
                                            
                                var marcadores = [
					<% for(ViviendaMarco vmarco : rsMonitor) { 
                                            //ViviendaMarco vmarco = vcampo.getViviendaMarco();
                                            Vivienda vcampo = vmarco.getViviendaCampo();
                                            Conglomerado cmarco = vmarco.getConglomerado();
                                            CoordenadaGeografica co = vcampo.getCoordenadaGPS();
                                        %> 
                                            {                                                                   
                                                position:{ 
                                                        lat : '<%= co.getLatitudDecimalString() /*de campo*/%>',
                                                        lng : '<%= co.getLongitudDecimalString() /*de campo*/%>'							
                                                },
                                                contenido: "<div>"
                                                                +"<h1>CONGLOMERADO : <%= cmarco.getCodigo() /*del marco*/ %></h1>"                                                                 
                                                                +"<p><strong>CENTRO POBLADO : </strong> <%= vmarco.getCentroPoblado().getNombre() /*del marco*/%></p>"                                                                 
                                                                +"<p><strong>Odei : </strong> <%= cmarco.getOdei().getNombre() /*del marco*/%></p>"
                                                                +"<p><strong>Mes : </strong> <%= cmarco.getMes().getNombre() /*del marco*/%></p>"
                                                                +"<p><strong>Periodo : </strong> <%= cmarco.getPeriodo().getNombre() /*del marco*/%></p>"
                                                                +"<p><strong>NRO SEL.VIV. : </strong> <%= vcampo.getCodigo() /*de campo*/%></p>"
                                                                +"<p><strong>Encuestador(es): </strong></p>"
                                                                <% if(vcampo.getHogares().isEmpty()) { %>
                                                                    +"<p> Sin informacion </p>"
                                                                <%} else { %>
                                                                    <% for(Hogar h : vcampo.getHogares()) { %>
                                                                        +"<p><%=h.getEncuestador().getDNINombresYApellidos() %></p>"
                                                                    <%}%>
                                                                <% } %>    
                                                                +"<p><strong>Latitud: </strong> <%= vcampo.getCoordenadaGPS().getLatitud() /*de campo*/%></p>"    
                                                                +"<p><strong>Longitud: </strong> <%= vcampo.getCoordenadaGPS().getLongitud() /*de campo*/%></p>"
                                                           +"</div>"
                                            }
                                        <%  if (x < nroReg) { %> , <% } %>  
                                        
                                        <% 
                                            x = x + 1; 
                                            //rsMonitor.movenext	
                                        }
					%>
					
											
				];//Fin Marcadores
				
				for (var i = 0, j = marcadores.length; i < j; i++) {
					var contenido = marcadores[i].contenido;
					var marker = new google.maps.Marker({
						position: new google.maps.LatLng(marcadores[i].position.lat, marcadores[i].position.lng),
						map: map,
						icon: 'images/ic_launcher.png'
					});
					(function(marker, contenido){						
						google.maps.event.addListener(marker, 'click', function() {
							infowindow.setContent(contenido);
							infowindow.open(map, marker);
						});
					})(marker,contenido);
				}
                                
                                inicio();
			}
		})();
                
                
	</script>        
    <%}%>
    
</body>
</html>